<template>
	<view>
		<view class="module" v-if="timeShow">
			<image class="bgimg" :src="baseUrl +  '/static/indexbg/new_bg1.png'" mode="aspectFill"></image>
			<image class="btn_tg" :src="baseUrl +  '/static/indexbg/ppzz.png'" mode="aspectFit" @click="goBrandZone">
			</image>
			<image class="btn_gwsc" :src="baseUrl +  '/static/indexbg/ymsc2.png'" mode="aspectFit"
				@click="goShoppingMall"></image>
			<image class="btn_mqzx" :src="baseUrl +  '/static/indexbg/bdsh.png'" mode="aspectFit" @click="goGroundCat">
			</image>
			<image class="btn_lsjf" :src="baseUrl +  '/static/indexbg/aimm.png'" mode="aspectFit" @click="btnClick(1)">
			</image>
			<image class="btn_rmkl" :src="baseUrl +  '/static/indexbg/lsjf2.png'" mode="aspectFit" @click="btnClick(2)">
			</image>
			<image class="btn_zwkf1" :src="baseUrl + '/static/indexbg/zwkf1.png'" mode="aspectFit" @click="gochat">
			</image>
			<image class="btn_zwkf2" :src="baseUrl + '/static/indexbg/zwkf2.png'" mode="aspectFit"></image>

			<view class="realName_box flex_dq" v-if="closeReal">
				<view class="realName flex_ld" v-if="!userReal">
					<view class=" flex_dq">
						<!-- <u-icon class="btn_gb" name="close" color="#ffffff" size="18" @click="closeReal = false"></u-icon> -->
						<text class="f28 c0">您尚未实名认证</text>
					</view>
					<text class="realname_txt" @click="goRealName">去实名</text>
				</view>
			</view>

			<u-popup :show="tipShow" mode="center" @close="tipShow = false" closeable bgColor="transparent">
				<view class="prompt flex_ZC">
					<text class="f36">提示</text>
					<text class="prompt_tit">该活动仅限实名会员参与</text>
					<view class="prompt_ntm flex_ld_a">
						<text @click="tipShow = false">再想想</text>
						<text @click="goReal">去认证</text>
					</view>
				</view>
			</u-popup>

			<u-popup :show="phoneShow" mode="center" @close="phoneShow = false" closeable bgColor="transparent">
				<view class="prompt flex_ZC">
					<text class="f36">提示</text>
					<text class="prompt_tit">是否去绑定手机号?</text>
					<view class="prompt_ntm flex_ld_a">
						<text @click="phoneShow = false">取消</text>
						<text @click="goBindPhone">确定</text>
					</view>
				</view>
			</u-popup>

		</view>

		<view class="" v-else>
			<u-skeleton rows="30" title loading></u-skeleton>
		</view>

	</view>

</template>

<script>
	import {
		myuser,
		cccc
	} from "../../api/user.js"
	export default {
		data() {
			return {
				baseUrl: this.$imageBaseUrl,
				list: [
					'/pagesMy/cloudCat/secondLevelSearch?type=1&zoneType=1',
					'/pageUser/myuser/chat',
					'/pageUser/myuser/greenintegral',
				],
				user: {},
				userReal: 0,
				closeReal: false,
				tipShow: false,
				phoneShow: false,
				loading: true,
				timeShow: false
			}
		},
		onLoad() {
			let that = this;
			setTimeout(function() {
				that.timeShow = true
			}, 1000);
		},

		onShow() {
			this.ttttt()
			this.tipShow = false
			this.phoneShow = false
			if (uni.getStorageSync('token')) {
				this.closeReal = true
				this.getinfo()
			}
		},
		methods: {
			// 个人信息
			ttttt() {
				cccc().then(res => {
					if (res.code == 1) {
						console.log(res)
						var result = [];
						var item = res.data.identity_pie_chart;
						for (var j = 0; j < item.length; j++) {
							var newItem = {};
							newItem.type = item[j].type;
							newItem.value = item[j].value;
							newItem.colorField = item[j].colorField;
							result.push(newItem);
						}
						// var newUserCount = {
						// 	type: "new_user_count",
						// 	value: data[i].data.new_user_count
						// };
						// result.push(newUserCount);
						// var userCount = {
						// 	type: "user_count",
						// 	value: parseFloat(data[i].data.user_count) 
						// };
						// result.push(userCount);
							console.log('11111',result);
						return result;
					}
				})
			},
			gochat() {
				uni.switchTab({
					url: "/pages/index/chat"
				})
			},
			login() {
				let that = this
				var options = {
					user: that.user.id.toString(),
					accessToken: that.user.hx_im_token,
					appKey: uni.WebIM.config.appkey
				};

				uni.WebIM.conn.open(options).then(res => {
						uni.setStorageSync("is_hxlogin", 1)
						console.log(res, "查看")
					})
					.catch((reason) => {
						console.log("login fail", reason);
					});
				// console.log("登录成功")

				// console.log("登录成功")

			},
			// 个人信息
			getinfo() {
				myuser().then(res => {
					if (res.code == 1) {
						console.log(res)
						this.user = res.data
						this.userReal = res.data.is_real
						uni.setStorageSync('hx_im_token', res.data.hx_im_token)
						uni.setStorageSync('userReal', res.data.is_real)
						if (res.data.mobile == '') {
							this.phoneShow = true
						}
						if (uni.getStorageSync("hx_im_token")) {
							this.login()
						}
					}
				})
			},
			goReal() {
				uni.navigateTo({
					url: "/pageUser/myuser/realname"
				})
			},
			btnClick(index) {
				console.log(index);
				if (uni.getStorageSync('token')) {
					if (index == 0 && this.user.is_real == 0) {
						this.tipShow = true
					} else {
						uni.navigateTo({
							url: this.list[index]
						})
					}
				} else {
					uni.navigateTo({
						url: '/pageLogin/login/login'
					})
				}
			},
			// 品牌专区
			goBrandZone() {
				uni.navigateTo({
					url: '/pagesMy/cloudCat/eventCenter?id=3'
				})
			},
			// 云猫商城
			goShoppingMall() {
				uni.switchTab({
					url: '/pages/index/cloudCatIndex'
				})
			},
			// 地猫商城
			goGroundCat() {
				uni.switchTab({
					url: '/pages/index/groundCat'
				})
			},
			// 绑定手机号
			goBindPhone() {
				uni.navigateTo({
					url: '/pageUser/myuser/bindphone'
				})
			},
			// 去实名
			goRealName() {
				uni.navigateTo({
					url: "/pageUser/myuser/realname"
				})
			}
		},
	}
</script>

<style scoped>
	.module {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		width: 750rpx;
	}

	.bgimg {
		position: relative;
		z-index: 2;
		width: 100%;
		height: 1700rpx;
		/* height: calc(100vh - var(--window-bottom)); */
		z-index: 2;
	}

	.btn_tg {
		position: absolute;
		top: 246rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_gwsc {
		position: absolute;
		top: 320rpx;
		left: 76rpx;
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_mqzx {
		position: absolute;
		top: 404rpx;
		right: 80rpx;
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_lsjf {
		position: absolute;
		top: 666rpx;
		left: 92rpx;
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_rmkl {
		position: absolute;
		top: 748rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_zwkf1 {
		position: absolute;
		top: 1048rpx;
		left: 158rpx;
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.btn_zwkf2 {
		position: absolute;
		top: 906rpx;
		right: 76rpx;
		width: 150rpx;
		height: 268rpx;
		z-index: 6;
	}

	.realName_box {
		width: 680rpx;
	}

	.realName {
		position: fixed;
		/* #ifdef MP-WEIXIN */
		bottom: 0;
		/* #endif */

		/* #ifdef H5 */
		bottom: 100rpx;
		/* #endif */
		width: 680rpx;
		height: 88rpx;
		background: rgba(0, 0, 0, 0.7);
		border-radius: 28rpx 28rpx 28rpx 28rpx;
		z-index: 999;
		padding: 0 26rpx;
	}

	.btn_gb {
		margin-right: 14rpx;
	}

	.realname_txt {
		width: 142rpx;
		height: 52rpx;
		line-height: 52rpx;
		text-align: center;
		background: #FFC300;
		font-size: 28rpx;
		color: #332C2B;
		border-radius: 154rpx 154rpx 154rpx 154rpx;
	}

	.prompt {
		width: 600rpx;
		background: #ffffff;
		margin: 0 auto;
		border-radius: 20rpx;
		padding-top: 10rpx;
		padding-bottom: 40rpx;
	}

	.prompt>text {
		margin-top: 40rpx;
	}

	.prompt_tit {
		margin: 0 30rpx;
		font-size: 28rpx;
		color: #666666;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.prompt_ntm {
		width: 100%;
		font-size: 30rpx;
		margin-top: 50rpx;
	}

	.prompt_ntm>text:nth-child(1) {
		width: 200rpx;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		background: #F2F2F2;
		border: 1rpx solid #F2F2F2;
		border-radius: 40rpx;
		color: #333333;
	}

	.prompt_ntm>text:nth-child(2) {
		width: 200rpx;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		background: linear-gradient(90deg, #FA2222 2%, #FFC400 98%);
		border-radius: 40rpx;
		color: #ffffff;
	}
</style>